/**
 * @author truexin
 * @date   16/05/10
 */
 .yue-main-detail{
    //height: 6.3rem;
	width: 100%; 
	padding-top: .1rem;
    background: #f2f2f2;
    color: #777;
    *{
        margin: 0;
        padding: 0;
    }
    ul {
        padding: 0;
        margin: 0;
        li {
            list-style: none;            
        }   
    }       
    
    .panel {
        border-top: 1px solid rgba(200, 200, 200, .3);
        border-bottom: 1px solid rgba(200, 200, 200, .3);
        position: relative;              
        background: #fff;
        font-size: .12rem;
        height: 3.6rem;
        .panel-top {
            padding-left: .2rem;
            padding-bottom: 1.8rem;
            clear: both;
            .left {       
                padding-top: .2rem;
                float: left;
                width: 29%; 
                .img-responsive{
                    width: 78%;
                    height: 100%;
                    border-radius: .05rem;
                }
                li {
                    height: .23rem;
                    &:first-child {
                        height: .8rem;
                    }
                    &:nth-child(2) { 
                        height: .39rem;
                        span{
                            padding-top: .05rem;
                            display: inline-block;
                            position: relative;                            
                            width: .15rem;
                            &::before{
                                font-family: 'yue-detail'!important;
                                content: '\e6c2';
                                color: #fb962e; 
                                font-size: .1rem;
                            } 
                        }                        
                    }
                    &:nth-child(3) {
                        padding-left: .2rem;
                    }
                    &:last-child {
                        font-size: .1rem;                    
                        i {                            
                            padding: 0 .02rem;                            
                            background: #fea6b9;
                            border-radius: 1px;  
                            color: #fff;
                            font-style: normal; 
                            &::before{                                
                                font-family: 'yue-detail'!important;
                                content: '\e6c0';
                            }
                        }
                    }
                }
            }
            .right {
                .title {
                    padding-bottom: .13rem;
                    color: #000;
                    line-height: .22rem;
                }
                padding-top:.25rem;
                float: left;
                width: 70%;
                .position {
                    color: #fe5801;
                }
                ul{
                    li {   
                        height: .27rem;                        
                        font-family: 'yue-detail'!important;                        
                        &::before{
                            content: '\e6c7';                           
                            color: #ccc; 
                            padding-right: .1rem; 
                        }
                        &:first-child{
                            &::before{
                                content: '\e6bf';
                                padding-right: .1rem; 
                            }                            
                        }
                        i {  
                            font-size: .1rem; 
                            padding: 0 .05rem;
                            background: #f65b5c;
                            border-radius: 1px; 
                            color: #fff;
                            font-style: normal;
                            margin-left: .1rem; 
                        }
                    }
                }
            }
            
            .far-time {
                display: inline-block;
                width: .6rem;                
                position: absolute;
                right: .22rem;
                top: .5rem;
                font-size: .1rem;
                color: #000;
                text-align: center;
            }
        }
        
        .comment-num {            
            border-top: 1px solid rgba(100, 100, 100, .3);   
            &:last-child{
                border-bottom: 1px solid rgba(100, 100, 100, .3);
            }       
            clear: both; 
            overflow: hidden; 
            padding:0 .2rem;
            .content{
                font-size: .145rem;
                height: .65rem;
                line-height: .25rem;
                padding-top: .1rem;
            }            
            li {
                float: left;  
                height: .4rem;
                padding-top: .08rem;
                line-height: .25rem;             
                &:first-child {
                    width: 2.2rem;                    
                }
                &:nth-child(3) {
                    padding-left: .1rem;                    
                }
                &.sign-blue{
                    border-right: 1px solid rgba(10, 10, 10, .1);
                    width: .53rem; 
                    height: .2rem;
                    line-height: .04rem;
                    margin-top: .105rem;                    
                    color: #01c0ca;
                }
            } 
            &.location{
                font-size: .145rem;
                li { 
                    padding-top: .06rem;
                    width: 82%;                    
                    height: .6rem;
                    &:first-child {
                        font-family: 'yue-detail'!important;
                        padding: .15rem 0 0 .1rem;
                        &::before{
                            content: '\e6bd';
                            font-size: .25rem;
                            color: #fe5800;                            
                        }                        
                        width: 18%;                    
                    }
                }                 
            }        
            
        }    
           
    }
    .userList{
        //height: 1.8rem;
        border-top: 1px solid rgba(200, 200, 200, .3);
        border-bottom: 1px solid rgba(200, 200, 200, .3);
        position: relative;
        margin-top: .1rem;
        background: #fff;
        font-size: .12rem;
        .imgList{
            border-top: 1px solid rgba(100, 100, 100, .3);  
            &:last-child{
                border-bottom: 1px solid rgba(100, 100, 100, .1);
            }  
            height: .8rem;
            overflow: hidden; 
            padding: .19rem .2rem 0 .2rem;
            li{
                float: left;       
                width: 80%;  
                font-size: .145rem;
                span{
                    font-size: .1rem;
                }
                &:first-child { 
                    height: .72rem;
                    width: 20%;                    
                }
                .img-responsive{
                    width: 70%;
                    height: 65%;
                    border-radius: 5px;
                }
                .right-date{
                    float: right;
                }
            }          
        }
    }
    .btn-bottom{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;        
        li{  
            a{
                display: inline-block;                           
                background: #01bfcb;
                width: 100%;
                height: 100%;
                color:#fff;

            }
            &:nth-child(2) {
                a{
                    border-left: 1px solid rgba(255, 255, 255, .5);
                    background: #00be90;
                }
            }
            width: 50%; 
            float: left; 
            height: .5rem; 
            text-align: center;
            line-height: .5rem;
        }
    }
 }